.ConstDivSetting
{
    box-sizing: border-box;
    width     : 1200px;
    margin    : 0 auto;
    >div
    {
        box-sizing: border-box;
    }
}
.ant-picker-time-panel-column::-webkit-scrollbar
{
    display: none;
}
.Ant-ReWriteRadioGroup
{
    .ant-form-item
    {
        margin-bottom: 5px;
    }
    .ant-radio-button-wrapper
    {
        border    : none;
        box-shadow: none;
        &::before
        {
            display: none;
        }
    }
}
.HFilter
{
    @extend .ConstDivSetting;
    margin-top: 20px;
    .HSearch
    {
        display       : flex;
        flex-direction: column;
    }
    .ant-form-item-label
    {
        font-weight: 600
    }
    .VisibleOption
    {
        @extend .Ant-ReWriteRadioGroup;
    }
    .ant-collapse-item
    {
        display       : flex;
        flex-direction: column-reverse;
        .ant-collapse-header
        {
            font-weight    : lighter;
            font-size      : 12px;
            color          : #9399a5;
            text-align     : center;
            justify-content: center;
        }
        .ant-collapse-content
        {
            @extend .Ant-ReWriteRadioGroup;
            .ant-collapse-content-box
            {
                padding: 0;
            }
        }
    }
    .TotalAndClean
    {
        display        : flex;
        justify-content: space-between;
        box-sizing     : border-box;
        padding-right  : 200px;
        >span
        {
            line-height: 32px;
        }
    }
}
.HouseList
{
    @extend .ConstDivSetting;
    padding-bottom: 20px;
    .ant-pagination
    {
        float: right;
    }
}
.ant-ribbon-wrapper
{
    max-width: 1000px;
}
.HouseItem_Wrapper
{
    display      : flex;
    padding      : 20px;
    max-width    : 1000px;
    margin-bottom: 10px;
    .ant-card-cover >img
    {
        width : 235px;
        height: 175px;
    }
    .ant-card-body
    {
        width  : 100%;
        padding: 0 0 0 20px;
        .ant-card-meta-title
        {
            font-size  : 22px;
            font-weight: bold;
            display    : flex;
            align-items: center;
            .ant-tag
            {
                margin     : 0 0 0 8px;
                font-weight: normal;
            }
        }
        .HosueItem_Detail
        {
            display        : flex;
            justify-content: space-between;
            .HInfo
            {
                display       : flex;
                flex-direction: column;
                >div
                {
                    >span
                    {
                        line-height : 21px;
                        margin-right: 5px;
                    }
                    display      : flex;
                    margin-bottom: 10px;
                }
            }
            .HRent
            {
                font-size  : 30px;
                font-weight: 400;
                color      : #fe615a;
            }
        }
    }
}
.HouseDetailInfo
{
    @extend .ConstDivSetting;
    display       : flex;
    flex-direction: column;
    padding-top   : 10px;
    .CarouselAndBaseInfo
    {
        box-sizing     : border-box;
        display        : flex;
        justify-content: space-between;
        margin-bottom  : 20px;
        .HCarousel
        {
            width          : 525px;
            display        : flex;
            flex-direction : column;
            justify-content: space-around;
            padding        : 0 20px;
            .HTitle
            {
                font-size  : 30px;
                font-weight: bold;
                display    : flex;
                align-items: center;
                >button:nth-child(1)
                {
                    margin-left: -32px;
                }
            }
            .HSubTitle
            {
                display       : flex;
                flex-direction: column;
                >span
                {
                    color: #9399a5;
                }
            }
            .ant-carousel .slick-slide img
            {
                height: 300px;
            }
        }
        .HBaseInfo
        {
            box-sizing     : border-box;
            width          : 600px;
            border         : 1px solid #e4e6f0;
            padding        : 30px;
            display        : flex;
            flex-direction : column;
            justify-content: space-around;
            .HRentAndFeature
            {
                padding-bottom: 5px;
                border-bottom : 1px solid #e4e6f0;
                .RentAndCollect
                {
                    display        : flex;
                    justify-content: space-between;
                    align-items    : center;
                    div:nth-child(1)
                    {
                        color          : #fe615a;
                        >span{
                            font-size  : 30px;
                            font-weight: 600;
                        }
                    }
                    div:nth-child(2)
                    {
                        user-select: none;
                        cursor     : pointer;
                        >span{
                            color         : #fe615a;
                            font-size     : 20px;
                            vertical-align: middle;
                            margin-right  : 5px;
                        }
                    }
                }
            }
            .BaseInfoEtc
            {
                display        : flex;
                justify-content: space-between;
                >div
                {
                    color: #9399a5;
                }
                border-bottom : 1px solid #e4e6f0;
            }
            .ContactOnlineOrPhone
            {
                display       : flex;
                flex-direction: column;
                .LandLordInfo
                {
                    font-size     : 20px;
                    padding-bottom: 20px;
                    display       : flex;
                    align-items   : center;
                    .AppIconTitle
                    {
                        width: 50px;
                    }
                }
            }
        }
    }
    .TargetBox
    {
        box-sizing      : border-box;
        background-color: #f7f9fb;
        margin-bottom   : 10px;
        padding         : 20px;
        z-index         : 9999;
        .ant-anchor
        {
            display       : flex;
            flex-direction: row;
        }
    }
    .DividerHouseInfo
    {
        font-weight: bold;
        font-size  : 30px;
        >span
        {
            padding-left: 0;
        }
        &::before{
            display: none;
        }
    }
    .SpanTitle
    {
        display     : inline-block;
        color       : #9399a5;
        font-size   : 20px;
        margin-right: 70px;
    }
    .InfoLists
    {
        display        : flex;
        justify-content: space-between;
        flex-wrap      : wrap;
        width          : 600px;
        >li
        {
            width    : 50%;
            font-size: 15px;
            margin   : 5px 0;
        }
    }
    .HDetailInfo
    {
        display       : flex;
        flex-direction: row;
    }
    .HFacilities
    {
        display       : flex;
        flex-direction: row;
        >ul
        {
            @extend .InfoLists;
            width: 700px;
            >li
            {
                display        : flex;
                flex-direction : column;
                width          : 20%;
                text-align     : center;
                >img
                {
                    height: 32px;
                    width : 32px;
                    margin: 0 auto;
                }
            }
        }
    }
    .Hdescription
    {
        display: flex;
        >ul
        {
            @extend .InfoLists;
            width          : 1000px;
            justify-content: flex-start;
            .ant-image
            {
                width : 280px;
                margin: 0 10px 10px 0;
                >img
                {
                    width: 100%;
                    height: 210px;
                }
            }
        }
    }
    .HRent
    {
        display       : flex;
        flex-direction: column;
        >ul
        {
            @extend .InfoLists;
            width: 700px;
            >li
            {
                width         : 20%;
                text-align    : center;
                display       : flex;
                flex-direction: column;
                font-size     : 17px;
                >span
                {
                    font-size: 14px;
                    color    : #9399a5;
                }
            }
        }
    }
    .HPositionMap
    {
        height    : 600px;
        box-sizing: border-box;
        padding   : 30px;
    }
}
.HComment
{
    box-sizing   : border-box;
    .CommentInput
    {
        display        : flex;
        justify-content: space-between;
        margin-bottom  : 10px;
        .ant-avatar
        {
            >img
            {
                width: 46px;
            }
        }
        >div
        {
            display       : flex;
            flex-direction: column;
            width         : 100%;
            box-sizing    : border-box;
            padding-left  : 30px;
            >textarea
            {
                width     : 100%;
                border    : 1px solid lightgray;
                transition: all .3s;
                box-sizing: border-box;
                padding   : 10px;
                resize    : none;
                &:hover{
                    border: 1px solid #1890ff;
                }
                &:focus
                {
                    outline   : none;
                    border    : 1px solid #1890ff;
                    box-shadow: 0px 0px 2px #1890ff ;
                }
            }
        }
        .PostImgs
        {
            display: flex;
            >div
            {
                box-sizing: border-box;
                padding   : 5px;
                position  : relative;
                &:hover{
                    & button
                    {
                        opacity: 1;
                    }
                }
                >img
                {
                    width   : 70px;
                    height  : 70px;
                }
                >button
                {
                    position  : absolute;
                    top       : 0;
                    right     : 0;
                    opacity   : 0;
                    transition: all .3s;
                }
            }
            >span
            {
                align-self: flex-end;
                color     : #9b9b9b;
            }
        }
    }
    .ant-comment-avatar img
    {
        width    : 100%;
        height   : 100%;
        transform: scale(70%);
    }
    .CommentItem
    {
        // .CommentInput
        // {
        //     .ant-avatar > img
        //     {
        //         border-radius: 50%;
        //         transform: scale(70%);
        //     }
        // }
        span
        {
            user-select: none;
            cursor     : pointer;
        }
        .CommentContent
        {
            img
            {
                max-width   : 300px;
                max-height  : 300px;
            }
        }
    }
}
.ant-select-item-option-content
{
    >div{
        display    : flex;
        align-items: center;
        >span:nth-child(2)
        {
            margin-left: 20px;
            font-weight: bold
        }
    }
}
.ConfirmOrder
{
    @extend .ConstDivSetting;
    display        : flex;
    justify-content: space-between;
    padding-top    : 30px;
    overflow       : auto;
    .OrderInfo
    {
        width         : 100%;
        display       : flex;
        flex-direction: column;
        margin-right  : 50px;
        .OrderInfo_Title
        {
            display    : flex;
            align-items: center;
            >span
            {
                font-weight: bold;
                font-size  : 30px;
                margin-left: 50px;
            }
        }
        .OrderInfo_Content
        {
            box-sizing: border-box;
            padding   : 30px 0;
            .DividerHouseInfo
            {
                padding-left: 0;
                font-size   : 22px;
                margin-top  : 30px;
            }
            .OrderInfo_Content_Item
            {
                margin   : 10px 0;
                font-size: 16px;
                //选择其父元素的第n个子元素.
                &:nth-child(10)
                {
                    font-size: 16px;
                }
                &:nth-child(12)
                {
                    font-size: 16px;
                }
                >div
                {
                    font-weight    : bold;
                    font-size      : 17px;
                    display        : flex;
                    justify-content: space-between;
                    align-items    : center;
                    margin-bottom  : 10px;
                }
            }
            .ant-select-selector
            {
                height     : 50px;
                padding-top: 5px;
                .ant-select-selection-item
                {
                    >div
                    {
                        display    : flex;
                        align-items: center;
                        >span:nth-child(2)
                        {
                            margin-left: 20px;
                            font-weight: bold;
                            font-size  : 20px;
                        }
                    }
                }
            }
        }
    }
    .OrderAmount
    {
        border       : 1px solid lightgrey;
        box-sizing   : border-box;
        padding      : 10px;
        border-radius: 15px;
        .ant-ribbon
        {
            top: 45px;
        }
        .HouseItem_Wrapper
        {
            font-size    : 12px;
            margin-bottom: 0;
            .ant-card-cover
            {
                >img
                {
                    width : 190px;
                    height: 132px;
                }
            }
            .ant-card-meta-title
            {
                font-size    : 15px;
                margin-bottom: 5px;
            }
            .HInfo
            {
                >div{
                    margin-bottom: 5px;
                }
                >div:nth-child(3){
                    .ant-tag
                    {
                        display: none;
                    }
                }
            }
            .VRAnimation
            {
                display:none;
            }
            .HosueItem_Detail
            {
                flex-direction: column;
                .HRent
                {
                    display: none;
                }
            }
        }
        .OrderCharge
        {
            display       : flex;
            flex-direction: column;
            box-sizing    : border-box;
            padding       : 5px 20px;
            >div
            {
                font-size      : 16px;
                display        : flex;
                justify-content: space-between;
                margin-bottom  : 10px;
            }
        }
    }
    .DividerHouseInfo
    {
        font-weight: bold;
        font-size  : 20px;
        padding: 0 20px;
        >span
        {
            padding-left: 0;
        }
        &::before{
            display: none;
        }
    }
}
.AddTenantInfo{
    display       : flex;
    box-sizing    : border-box;
    flex-direction: column;
}
.PaymentNotification
{
    .ant-modal-body
    {
        display        : flex;
        flex-direction : column;
        justify-content: center;
        align-items    : center;
        font-size      : 20px;
        font-weight    : bold;
        overflow       : hidden;
    }
    .ant-modal-footer
    {
        display: flex;
        justify-content: space-between;
    }
}
.RefundOrder
{
    width         : 1200px;
    margin        : 0 auto;
    display       : flex;
    flex-direction: column;
    box-sizing    : border-box;
    padding       : 30px 0;
    .ant-alert
    {
        margin-bottom: 20px;
    }
    >h1
    {
        font-weight: bold;
        font-size  : 40px;
        margin     : 0;
        display    : flex;
        align-items: center;
        color      : rgb(72, 72, 72);
        >button
        {
            margin-left: -32px;
        }
    }
    .RefundDescription
    {
        display       : flex;
        flex-direction: column;
        >span
        {
            font-size  : 20px;
            font-weight: bold;
            color      : rgb(72, 72, 72);
        }
        >p
        {
            margin   : 20px 0;
            font-size: 16px;
            max-width: 750px;
        }
        .RefundRange
        {
            display       : flex;
            flex-direction: row;
            width         : 100%;
            >div
            {
                height        : 90px;
                display       : flex;
                font-size     : 16px;
                color         : rgb(72, 72, 72);
                font-weight   : bold;
                box-sizing    : border-box;
                padding-bottom: 10px;
                border-bottom : 10px solid rgb(216, 216, 216);
                margin-right  : 10px;
                position      : relative;
                .ant-divider-vertical
                {
                    margin-left: 0;
                    height     : 100%;
                }
                >p
                {
                    position : absolute;
                    left     : 10px;
                    bottom   : 0px;
                    font-size: 12px;
                }
            }
            >div:nth-child(1)
            {
                flex-grow: 1;
            }
            >div:nth-child(2)
            {
                flex-grow: 1;
                border-bottom: 10px solid rgb(0, 132, 137);
            }
            >div:nth-child(3)
            {
                flex-grow: 2;
                border-bottom: 10px solid rgb(255, 90, 95);
            }
        }
    }
    .RefundReason
    {
        display        : flex;
        flex-direction : row;
        justify-content: space-around;
        >div
        {
            min-width: 310px;
            >span
            {
                box-sizing : border-box;
                padding    : 5px 0;
                display    : block;
                font-weight: bold;
                color      : rgb(72, 72, 72);
            }
            display       : flex;
            flex-direction: column;
        }
    }
    .OtherRule
    {
        font-size      : 12px;
        display        : flex;
        flex-direction : row;
        flex-wrap      : wrap;
        justify-content: space-between;
        max-width      : 1000px;
        >div
        {
            margin-bottom: 30px;
            margin-right : 10px;
            max-width    : 400px;
            >span
            {
                display    : block;
                font-weight: bold;
                color      : rgb(72, 72, 72);
            }
        }
    }
}
.HouseRepair
{
    width         : 1200px;
    margin        : 0 auto;
    display       : flex;
    flex-direction: column;
    padding-bottom: 50px;
    >h1
    {
        font-weight  : bold;
        font-size    : 40px;
        margin       : 0;
        display      : flex;
        align-items  : center;
        color        : rgb(72, 72, 72);
        margin-bottom: 50px;
        >button
        {
            margin-left: -32px;
        }
    }
    .ant-steps
    {
        margin-bottom: 50px;
    }
    .RepairForm
    {
        margin: 0 auto;
        width : 100%;
        .ant-form-item-label
        {
            width: 100px;
        }
        .RepairItemList
        {
            width          : 500px;
            display        : flex;
            flex-direction : row;
            flex-wrap      : wrap;
            justify-content: space-between;
            >div
            {
                width: 90px;
            }
        }
        textarea
        {
            resize: none;
        }
    }
    .RepairActions
    {
        margin-top: 20px;
        >button
        {
            margin-right: 10px;
        }
    }
    .RepairConfirm
    {
        .ant-result-subtitle
        {
            display        : flex;
            flex-direction : column;
            justify-content: center;
            align-items    : center;
            .ant-alert
            {
                margin-bottom: 20px;
            }
        }
        table
        {
            text-align: left;
            border    : 1px solid lightgray;
            tr
            {
                border: 1px solid lightgray;
                th
                {
                    padding         : 16px 24px;
                    min-width       : 200px;
                    background-color: #fafafa;
                    border-right    : 1px solid lightgray;
                }
                td
                {
                    padding  : 16px 24px;
                    min-width: 300px;
                    color    : rgb(72, 72, 72);
                }
                &:nth-last-child(1)
                {
                    td
                    {
                        padding: 40px 24px;
                    }
                }
            }

        }
    }
}
